import { findSubpageRoot } from "../../utils";

import BaseComponent from "../../../app/baseComponent";

import { GLOBAL_APP_CLS } from "../../variable";

export class KxAppModule extends BaseComponent {
    constructor(name) {
        super(name);       
    }
    _template() {
        var self = this;
        return `<div class="${GLOBAL_APP_CLS}-page-module ${self._name}">
    <div class="aui-tabnavs">
        <ul class="aui-tabnavs__tabs"><li 
        class="aui-tabnavs__li" 
        :class="{'active': route.active}" v-for="route in routes"><router-link 
        :to="route._path">{{route.name}}</router-link></li></ul>                    
    </div>
    <router-view></router-view>
</div>`;
    }
    _mounted() {        
        var self = this;
        var rootSubpage = findSubpageRoot(self.$route);
        
        if (rootSubpage) 
        {
            self.routes = rootSubpage.children.map(function (v) {
                v.active = false;
                v._path = rootSubpage.path + "/" + v.path;
                return v;
            })
        }
    }
    _data() {
        var ret = {};
        ret.routes = [];
        return ret;
    }  
}